<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<title>interface</title>
	<link rel="stylesheet" type="text/css" href="starbuzz.css">
</head>

<body>

	<header class="top">

		<!-- <img id="headerLogo" src="images/dian1.png""  width='380'> -->
		<div>
			<span>&copy; 项目编号:
			</span>
			<br>
			<span>&copy; 项目名称：</span>
		</div>
      <!-- <img id=" headerSlogan" src="images/a4-3xbblue.png" width='400'> -->

	</header>

	<div id="tableContainer">
		<!-- <div id="tableRow"> -->

		<section id="drinks">
			<div>
				<h1>项目名称

					<select id="sel">
						<option value="" selected disabled hidden>模式选择</option>
						<option value="模式1">模式1</option>
						<option value="模式2">模式2</option>
						<option value="模式3">模式3</option>
					</select>
					<p id='moshi'>模式选择:&nbsp;&nbsp; </p>
				</h1>
				<br>

				<h2>功能描述：</h2>
				<p id="func"></p>
			</div>
			<div class="task">
				<h1>详细介绍</h1>
				<br>
				<!-- <img src="images\task.png" class="ta"> -->
			</div>

		</section>

		<section id="blog">

			<div id="result">
				<button class='button4' onclick="exec1('python  C:/Users/GZH/Desktop/HTML/python.py')">执行
					后端程序</button></p>
				<iframe name="result" width="500" height="300" scrolling="no" frameborder="3" id="task1">
				</iframe>
				<p>程序输出信息：</p>
				<iframe class="ifr1" name="result1" width="500" height="170" scrolling="no" frameborder="3" id="task2">
				</iframe>
				<a href="C:/Users/GZH/Desktop/HTML/res1.txt" target="result" class="tar"></a>
				<a href="C:/Users/GZH/Desktop/HTML/res2.txt" target="result1" class="tar"></a>
				<p><button class="btn">Continue</button></p>
			</div>

		</section>
		<section id="blog1">
			<!-- <div class='cl1'>
				<h1>图片介绍</h1>
				<br>
				<!-- <img src="images\grid2.png" class="ta1" width="102%"> -->
			<!-- </div> -->
			<h1 class="people">前后端交互</h1>
			<br>
			<div id="input">
				<textarea id="data" rows="3" cols="40" background:transparent></textarea>

				<button class="btn2" onclick="input()">Finished</button>
			</div>

		</section>
	</div>

	<!-- <footer>
	</footer> -->
	<script type="text/javascript">
		'点击continue显示内容'
		window.onload = function () {
			var doc = document.getElementById("task1").contentDocument || document.frames["result"].document;
			var doc1 = document.getElementById("task2").contentDocument || document.frames["result1"].document;
			var tex1 = document.querySelector('#data')
			var sel = document.querySelector('#sel');
			sel.options[0].selected = true;
			tex1.value = '';
			doc.body.innerHTML = '';
			doc1.body.innerHTML = '';
			var btn = document.querySelector('.btn');
			btn.onclick = function () {
				// console.log(1111);
				document.querySelectorAll('.tar')[0].click();
				document.querySelectorAll('.tar')[1].click();
				input2();
			}
		
			var func = document.getElementById('func');

			//首先获得下拉框的节点对象；
			var select = document.getElementById("sel");
			select.onchange = function () {
				//1.如何获得当前选中的值？
				var value = select.value;
				if (value === '模式1') {
					func.innerHTML = '功能1'
				}
				if (value === '模式2') {
					func.innerHTML = '功能2'
				}
				if (value === '模式3') {
					func.innerHTML = '功能3'
				}
			}
		}

	</script>
	<script language="JavaScript">
		'执行python程序'
		function exec1(command) {
			var ws = new ActiveXObject("WScript.Shell");
			ws.run(command);           //exec 和 run
			ws = null;
		}
		'前端输入'
		function input() {
			text = document.getElementById("data").value;  //获得网页文本框的值
			var strFile = "C:/Users/GZH/Desktop/HTML/human.txt";	//定义文件保存的路径
			var objFSO = new ActiveXObject("Scripting.FileSystemObject");
			var objStream = objFSO.CreateTextFile(strFile, true);
			objStream.WriteLine(text);  //写值
			objStream.Close();
		}
	  	console.log(str);
	</script>
</body>
</html>